<!DOCTYPE html>
<html  class="x-admin-sm">
<#include "../layout/meta.ftl">
<body class="layui-layout-body">
<div style="margin: 2vw">
    <fieldset class="layui-elem-field layui-field-title">
        <legend>Docker 容器列表</legend>
    </fieldset>
    <table class="layui-hide" id="project" lay-filter="project"></table>
</div>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除</a>
</script>
<style>
    .layui-table-cell {
        height:auto;
    }
</style>
<script>
    //JavaScript代码区域
    layui.use(['element','table'], function(){
        let element = layui.element,table = layui.table;

        tableId=table.render({
            elem: '#project'
            ,url:'/docker/getImagesList'
            ,method:'get'
            ,contentType:'application/json'
            ,height:"full-110"
            ,cols: [[
                {field:'Id', width: '20%', title: '镜像ID',unresize:true,templet:function (data) {
                        return data.Id.substr(0,30)
                    }}
                ,{field:'RepoTags', width: '25%',  title: 'Tags',unresize:false,templet:function (data) {
                        return data.RepoTags
                    }}
                ,{field:'Labels',width: '35%',  title: '描述',unresize:false,templet:function (data) {
                        let datas='';
                        for(let key  in data.Labels){
                            datas+=(key + '---' + data.Labels[key])+'<br>';
                        }
                        return datas;
                    }}
                ,{field:'Created', width: '15%',  title: '创建时间',unresize:true,templet:function (data) {
                        let now = new Date(data.Created * 1000);
                        let year = now.getFullYear();
                        let month = now.getMonth() + 1;
                        let date = now.getDate();
                        let hour = now.getHours();
                        let minute = now.getMinutes();
                        let second = now.getSeconds();
                        return year + "-" + month + "-" + date + " " + hour + ":" + minute + ":" + second;
                    }},
                ,{ title:'操作', toolbar: '#barDemo'}
            ]]
            ,parseData: function(res){ //res 即为原始返回的数据
                return {
                    "code": 0, //解析接口状态
                    "msg": res.message, //解析接口状态
                    "data": res.data, //解析数据列表
                    "count": res.data.total, //解析数据长度
                };
            }
            ,
            done: function (res, curr, count) {
                exportData=res.data;
            }
        });
        //监听工具条
        table.on('tool(project)', function (obj) {
            let data = obj.data;
            switch (obj.event) {
                case "del":projectDel("/docker/imageDel/"+data.Id,"是否删除");break;
            }
        });
        function projectDel(url,msg) {
            layer.alert(msg,function () {
                $.ajax({
                    url:url,
                    type:"get",
                    success:function (res) {
                        layer.msg("操作成功", {icon: 1});
                        tableId.reload({
                            page: 1
                        });
                    }
                });
            });
        }


    });
</script>
</body>
</html>